$(function () {
    function randomData() {
        now = new Date(+now + oneDay);
        value = value + Math.random() * 21 - 10;
        return {
            name: now.toString(),
            value: [
                [now.getFullYear(), now.getMonth() + 1, now.getDate()].join('/'),
                Math.round(value)
            ]
        }
    }
    var data = [];
    var now = +new Date(1997, 9, 3);
    var oneDay = 24 * 3600 * 1000;
    var value = Math.random() * 1000;
    for (var i = 0; i < 1000; i++) {
        data.push(randomData());
    }

    function initBusTrend() {
        var busTrendChart = echarts.init(document.getElementById('bus-trend'));
        var busTrendOption = {
            color: ['#1f8bd7'],
            grid: {
                left: '10%',
                right: '5%',
                top: '5%',
                bottom: '30%'
            },
            tooltip: {
                trigger: 'axis',
                formatter: function (params) {
                    params = params[0];
                    var date = new Date(params.name);
                    return date.getDate() + '/' + (date.getMonth() + 1) + '/' + date.getFullYear() + ' : ' + params.value[1];
                },
                axisPointer: {
                    animation: false
                }
            },
            xAxis: {
                type: 'time',
                splitLine: {
                    show: false
                }
            },
            yAxis: {
                type: 'value',
                boundaryGap: [0, '100%'],
                splitLine: {
                    show: false
                }
            },
            series: [{
                name: '模拟数据',
                type: 'line',
                showSymbol: false,
                hoverAnimation: false,
                data: data
            }]
        };
        setInterval(function () {

            for (var i = 0; i < 5; i++) {
                data.shift();
                data.push(randomData());
            }

            busTrendChart.setOption({
                series: [{
                    data: data
                }]
            });
        }, 1000);
        busTrendChart.setOption(busTrendOption);
    }

    function initSubway() {
        var subwayChart = echarts.init(document.getElementById('subway-trend'));
        var subwayOption = {
            color: ['#1f8bd7'],
            grid: {
                left: '10%',
                right: '5%',
                top: '5%',
                bottom: '30%'
            },
            tooltip: {
                trigger: 'axis',
                formatter: function (params) {
                    params = params[0];
                    var date = new Date(params.name);
                    return date.getDate() + '/' + (date.getMonth() + 1) + '/' + date.getFullYear() + ' : ' + params.value[1];
                },
                axisPointer: {
                    animation: false
                }
            },
            xAxis: {
                type: 'time',
                splitLine: {
                    show: false
                }
            },
            yAxis: {
                type: 'value',
                boundaryGap: [0, '100%'],
                splitLine: {
                    show: false
                }
            },
            series: [{
                name: '模拟数据',
                type: 'line',
                showSymbol: false,
                hoverAnimation: false,
                data: data
            }]
        };
        setInterval(function () {

            for (var i = 0; i < 5; i++) {
                data.shift();
                data.push(randomData());
            }

            subwayChart.setOption({
                series: [{
                    data: data
                }]
            });
        }, 1000);
        subwayChart.setOption(subwayOption);
    }

    function initCar() {
        var carChart = echarts.init(document.getElementById('car-trend'));
        var carOption = {
            color: ['#1f8bd7'],
            grid: {
                left: '10%',
                right: '5%',
                top: '5%',
                bottom: '30%'
            },
            tooltip: {
                trigger: 'axis',
                formatter: function (params) {
                    params = params[0];
                    var date = new Date(params.name);
                    return date.getDate() + '/' + (date.getMonth() + 1) + '/' + date.getFullYear() + ' : ' + params.value[1];
                },
                axisPointer: {
                    animation: false
                }
            },
            xAxis: {
                type: 'time',
                splitLine: {
                    show: false
                }
            },
            yAxis: {
                type: 'value',
                boundaryGap: [0, '100%'],
                splitLine: {
                    show: false
                }
            },
            series: [{
                name: '模拟数据',
                type: 'line',
                showSymbol: false,
                hoverAnimation: false,
                data: data
            }]
        };
        setInterval(function () {

            for (var i = 0; i < 5; i++) {
                data.shift();
                data.push(randomData());
            }

            carChart.setOption({
                series: [{
                    data: data
                }]
            });
        }, 1000);
        carChart.setOption(carOption);
    }

    function initBike() {
        var bikeChart = echarts.init(document.getElementById('bike-trend'));
        var bikeOption = {
            color: ['#1f8bd7'],
            grid: {
                left: '10%',
                right: '5%',
                top: '5%',
                bottom: '30%'
            },
            tooltip: {
                trigger: 'axis',
                formatter: function (params) {
                    params = params[0];
                    var date = new Date(params.name);
                    return date.getDate() + '/' + (date.getMonth() + 1) + '/' + date.getFullYear() + ' : ' + params.value[1];
                },
                axisPointer: {
                    animation: false
                }
            },
            xAxis: {
                type: 'time',
                splitLine: {
                    show: false
                }
            },
            yAxis: {
                type: 'value',
                boundaryGap: [0, '100%'],
                splitLine: {
                    show: false
                }
            },
            series: [{
                name: '模拟数据',
                type: 'line',
                showSymbol: false,
                hoverAnimation: false,
                data: data
            }]
        };
        setInterval(function () {

            for (var i = 0; i < 5; i++) {
                data.shift();
                data.push(randomData());
            }

            bikeChart.setOption({
                series: [{
                    data: data
                }]
            });
        }, 1000);
        bikeChart.setOption(bikeOption);
    }

    function initBikeNum() {
        var bikeNumChart = echarts.init(document.getElementById('bike-num-trend'));
        var bikeNumOption = {
            color: ['#1f8bd7'],
            grid: {
                left: '10%',
                right: '5%',
                top: '5%',
                bottom: '30%'
            },
            tooltip: {
                trigger: 'axis',
                formatter: function (params) {
                    params = params[0];
                    var date = new Date(params.name);
                    return date.getDate() + '/' + (date.getMonth() + 1) + '/' + date.getFullYear() + ' : ' + params.value[1];
                },
                axisPointer: {
                    animation: false
                }
            },
            xAxis: {
                type: 'time',
                splitLine: {
                    show: false
                }
            },
            yAxis: {
                type: 'value',
                boundaryGap: [0, '100%'],
                splitLine: {
                    show: false
                }
            },
            series: [{
                name: '模拟数据',
                type: 'line',
                showSymbol: false,
                hoverAnimation: false,
                data: data
            }]
        };
        setInterval(function () {

            for (var i = 0; i < 5; i++) {
                data.shift();
                data.push(randomData());
            }

            bikeNumChart.setOption({
                series: [{
                    data: data
                }]
            });
        }, 1000);
        bikeNumChart.setOption(bikeNumOption);
    }

    function initCarChart() {
        var carChart = echarts.init(document.getElementById('car-chart'));
        var carOption = {
            color: ["#1f8bd7", "#8f60e3", "#eb4d4a", "#f3a634", "#42a75a"],
            series: [{
                name: '投诉分析',
                type: 'pie',
                radius: ['50%', '96%'],
                center: ['50%', '50%'],
                data: [{
                    value: 123,
                    name: '拒载'
                }, {
                    value: 412,
                    name: '强制拼载'
                }, {
                    value: 241,
                    name: '服务态度差'
                }, {
                    value: 111,
                    name: '要价不合理'
                },{
                    value: 444,
                    name: '其他原因'
                }],
                label: {
                    normal: {
                        show: false
                    }
                },
                labelLine: {
                    normal: {
                        show: false
                    }
                },
                legendHoverLink: false,
                hoverAnimation: false,
                itemStyle: {
                    emphasis: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }]
        };
        carChart.setOption(carOption);
    }

    function initTingChart() {
        var tingChart = echarts.init(document.getElementById('ting-chart'));
        var tingOption = {
            color: ["#1f8bd7", "#f3a634"],
            series: [{
                name: '停车泊位构成',
                type: 'pie',
                radius: ['50%', '96%'],
                center: ['50%', '50%'],
                data: [{
                    value: 123,
                    name: '停车位'
                }, {
                    value: 241,
                    name: '道路停车泊位'
                }],
                label: {
                    normal: {
                        show: false
                    }
                },
                labelLine: {
                    normal: {
                        show: false
                    }
                },
                legendHoverLink: false,
                hoverAnimation: false,
                itemStyle: {
                    emphasis: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }]
        };
        tingChart.setOption(tingOption);
    }

    function initAll() {
        initTingChart();
        initCarChart();
        initBusTrend();
        initSubway();
        initCar();
        initBike();
        initBikeNum();
    }

    initAll();
});
